<style>
    #obj-update {
        padding: 20px 25px 25px 0;
    }

    #obj-update .layui-treeSelect .ztree li a, .ztree li span {
        margin: 0 0 2px 3px !important;
    }
</style>
<div class="layui-fluid" id="obj-update">
    <form class="layui-form" action="" lay-filter="obj-update-form">
        <div class="layui-form-item febs-hide">
            <label class="layui-form-label febs-form-item-require">记录id：</label>
            <div class="layui-input-block">
                <input type="text" name="id" data-th-value="${obj.id}">
            </div>
        </div>
        <input type="hidden" id="fileId" name="fileId" class="layui-input" >
        <div class="layui-form-item">
            <label class="layui-form-label">部门：</label>
            <div class="layui-input-block">
                <input type="text" name="deptId" id="deptId" lay-filter="deptId" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">标题：</label>
            <div class="layui-input-block">
                <input type="text" name="title" class="layui-input">
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">内容：</label>
            <div class="layui-input-block">
                <textarea id="content" name="content" style="display: none;"></textarea>
                <!--<script id="container" name="content" type="text/plain"></script>-->

            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">附件：</label>
            <button type="button" class="layui-btn" id="test1">
                <i class="layui-icon">&#xe67c;</i>上传文件
            </button>
            <div th:id="'div-'+${file.id}"  th:each="file : ${files}" th:if="${file} ne null">
                <span th:text="${file.realName}"></span>
                <a  th:id="'file-'+${file.id}">删除</a>
            </div>
            <div class="layui-upload-list">
                <p id="demoText" ></p>
            </div>
        </div>


        <div class="layui-form-item febs-hide">
            <button class="layui-btn" lay-submit="" lay-filter="obj-update-form-submit" id="submit"></button>
        </div>
    </form>
</div>

<script data-th-inline="javascript">

    layui.use(['febs', 'form','layer', 'formSelects', 'validate', 'treeSelect','layedit','upload'], function () {
        var $ = layui.$,
            febs = layui.febs,
            layer = layui.layer,
            form = layui.form,
            treeSelect = layui.treeSelect,
            layedit = layui.layedit,
            upload = layui.upload,
            obj = [[${obj}]],
            files = [[${files}]],
            $view = $('#obj-update'),
            validate = layui.validate;

        form.verify(validate);
        form.render();
        //删除文件的方法
        function delFile(fileId){

            layer.confirm('确定删除吗？', function(index){

                //调用后台，删除相关文件
                $.ajax({
                    type: "GET",
                    url:'/tFile/delete/' + fileId,
                    data: {},
                    dataType: "json",
                    success: function(result) {
                        $("#div-"+fileId).hide()
                        layer.msg("文件删除成功")
                    }
                })
            });
        }

        //为每个文件的删除按钮u绑定事件
        $.each(files,function (i,val) {
            if(val){
                $("#file-"+val.id).click(function () {
                    delFile(val.id);
                })
            }

        })


        //富文本编辑
        $("#content").val(obj.content)
        var contentEdit = layedit.build('content',{
            tool: ['strong','italic','underline','del','left', 'center', 'right', 'face'],
        });
        //部门下拉树
        treeSelect.render({
            elem: $view.find('#deptId'),
            type: 'get',
            data: ctx + 'dept/select/tree',
            placeholder: '请选择',
            search: false,
            success: function () {
                treeSelect.checkNode('deptId', obj.deptId);
            }
        });
        //文件上传
        var uploadInst = upload.render({
            elem: '#test1' //绑定元素
            ,url: '/tFile/fileUpload' //上传接口
            ,accept: 'file'
            ,multiple:true
            ,size: 0
            ,auto: true
            ,before: function(obj){
                //预读本地文件示例，不支持ie8
                obj.preview(function(index, file, result){
                    $('#demoText').html(file.name); //图片链接（base64）
                });
            }
            ,done: function(res){
                //如果上传失败
                if(res.code != 200){
                    return layer.msg('上传失败');
                }

                //上传成功
                var fileName = res.data.realName;
                var fileId = res.data.id;
                $("#fileId").val(fileId)
                var demoText = $('#demoText');
                demoText.html(fileName+'<span style="color: green;"><i class="layui-icon layui-icon-ok" style="color: green;"></i>上传成功</span> ');
                return layer.msg('上传成功');
            }
            ,error: function(){
                //演示失败状态，并实现重传
                var demoText = $('#demoText');
                demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-xs demo-reload">重试</a>');
                demoText.find('.demo-reload').on('click', function(){
                    uploadInst.upload();
                });
            }
        });
        initobjValue();


        function initobjValue() {

            form.val("obj-update-form", {
                "id": obj.id,
                "title": obj.title,
                "content": obj.content,
                "createdTime": obj.createdTime,
                "updatedTime": obj.updatedTime,
                "content":obj.content
            });
        }

        form.on('submit(obj-update-form-submit)', function (data) {
            //获取编辑器的内容
            var content = layedit.getText(contentEdit)
            data.field.content = content
            if (febs.nativeEqual(data.field, obj)) {
                febs.alert.warn('数据未作任何修改！');
                return false;
            }
            febs.post(ctx + 'policy/update', data.field, function () {
                layer.closeAll();
                febs.alert.success('数据修改成功');
                $('#febs-obj').find('#query').click();
            });
            return false;
        });
    });
</script>